* { padding: 0; margin: 0; font-size: 16px; }
html,body { width: 100%; height: 100%; font-family:"Microsoft YaHei"; }
.shade {  z-index: 999; width: 100%; height: 100%; position: absolute; top: 0; left: 0;  background:#000; background:rgba(0,0,0,0.3); filter:alpha(opacity=30);
}

.lodingWarp { width: 100%; height: 100%; position: absolute; top: 0; left: 0; text-align: center; z-index: 1000; }
.lodingWarp:before {content: ''; height: 100%; display: inline-block; vertical-align: middle; }
.lodingWarp .lodingBox { display: inline-block; vertical-align: middle; background:#666;border-radius: 5px;padding: 15px; }
.lodingWarp .lodingBox .loader-inner { display: inline-block; line-height: 0; margin: 0 auto;}
.lodingWarp .lodingBox .imgBox { margin: 0 auto; height: 50px; width: 50px; }
.lodingWarp .lodingBox .imgBox img { max-width: 100%; max-height: 100%; }
.lodingWarp .lodingBox .tipsBox { color: #fff; font-size: 16px; margin-top: 10px; }

.buttonBox { padding: 15px; }
.button { width: 240px; height: 35px; margin: 15px auto; line-height: 35px; color: #fff; text-align: center; background-color: #3367d6; cursor: pointer; font-size: 14px; }

#lodingWarp { width: 300px; height: 300px; position: fixed; bottom: 20px; left: 20px; border: 1px solid #ccc; }